// import Vue from "vue";
import VXETable from "vxe-table";

import FilterComplex from "./FilterComplex.vue";
import FilterTimeRange from "./FilterTimeRange.vue";
import FilterInput from "./FilterInput.vue";
import FilterExtend from "./FilterExtend.vue";
// 创建一个条件的渲染器
VXETable.renderer.add("FilterComplex", {
  // 不显示底部按钮，使用自定义的按钮
  showFilterFooter: false,
  // 筛选模板
  renderFilter(h, renderOpts, params) {
    console.log(renderOpts);
    return [
      <FilterComplex
        params={params}
        key={params.column.property}
      ></FilterComplex>,
    ];
  },
  // 重置数据方法
  filterResetMethod() {
    //
  },
  // 筛选数据方法
  filterMethod() {
    return false;
  },
});
// 创建一个条件的渲染器
VXETable.renderer.add("FilterTimeRange", {
  // 不显示底部按钮，使用自定义的按钮
  showFilterFooter: false,
  // 筛选模板
  renderFilter(h, renderOpts, params) {
    console.log(renderOpts);
    return [
      <FilterTimeRange
        params={params}
        key={params.column.property}
      ></FilterTimeRange>,
    ];
  },
  // 重置数据方法
  // filterResetMethod() {},
  // 筛选数据方法
  filterMethod({ option, row, column }) {
    console.log(option, row, column, 55555);
    return false;
  },
});

// 创建一个条件的渲染器
VXETable.renderer.add("FilterInput", {
  showFilterFooter: false,
  renderFilter(renderOpts, params) {
    console.log(renderOpts, params, 55464);
    return <FilterInput params={params}></FilterInput>;
  },
  // 重置数据方法
  filterResetMethod(params) {
    const { options } = params;
    options.forEach((option) => {
      option.data = "";
    });
  },
  // 重置筛选复原方法（当未点击确认时，该选项将被恢复为默认值）
  filterRecoverMethod({ option }) {
    option.data = "";
  },
  // 筛选方法
  filterMethod(params) {
    console.log(333333333);
    const { option, row, column } = params;
    const { data } = option;
    const cellValue = row[column.field];
    if (cellValue) {
      return cellValue.indexOf(data) > -1;
    }
    return false;
  },
});
VXETable.renderer.add("FilterExtend", {
  // 不显示底部按钮，使用自定义的按钮
  showFilterFooter: false,
  // 筛选模板
  renderFilter(renderOpts, params) {
    // console.log(params, 2222);
    return [
      //全局注册的组件
      <FilterExtend
        params={params}
        key={params.column.property}
      ></FilterExtend>,
    ];
  },
  // 重置数据方法
  filterResetMethod({ options }) {
    options.forEach((option) => {
      option.data = {
        vals: [],
        sVal: "",
        fMenu: "",
        f1Type: "",
        f1Val: "",
        fMode: "and",
        f2Type: "",
        f2Val: "",
      };
    });
  },
  // 筛选数据方法
  filterMethod({ option, row, column }) {
    const cellValue = row[column.property];
    const { vals, f1Type, f1Val } = option.data;
    // 无筛选条件
    if (!vals.length) return true;

    // TODO: 保留的旧逻辑，需再确认
    if (cellValue && f1Type) {
      return cellValue.indexOf(f1Val) > -1;
    }

    return vals.includes(cellValue);
  },
});
